<%@ page language="java" pageEncoding="utf-8"%>

<script type="text/javascript">
Ext.onReady(function(){
	Ext.state.Manager.setProvider(new Ext.state.CookieProvider());

	var cashFlowAdd = function(){
    var cashFlowAddField = new Array();
        cashFlowAddField.push({
	        xtype : 'hidden',
	        fieldLabel : '流水ID',
	        name : 'flowID',
	        allowBlank : true ,
	        anchor : '80%'
		});
    	cashFlowAddField.push({
	        xtype : 'datefield',
	        fieldLabel : '收支时间',
	        name : 'payDate',
	        allowBlank : true ,
			format:'Y-m-d',
	        anchor : '80%'
		});
    	cashFlowAddField.push({
	        xtype : 'textfield',
	        fieldLabel : '账户',
	        name : 'payAccount',
	        allowBlank : true ,
	        anchor : '80%'
		});
    	cashFlowAddField.push({
	        xtype : 'textfield',
	        fieldLabel : '收支分类',
	        name : 'payType',
	        allowBlank : true ,
	        anchor : '80%'
		});
    	cashFlowAddField.push({
	        xtype : 'textfield',
	        fieldLabel : '家庭成员',
	        name : 'operator',
	        allowBlank : true ,
	        anchor : '80%'
		});
    	cashFlowAddField.push({
	        xtype : 'numberfield',
	        fieldLabel : '金额',
	        name : 'amount',
	        allowBlank : true ,
	        anchor : '80%'
		});
    	cashFlowAddField.push({
	        xtype : 'textfield',
	        fieldLabel : '摘要',
	        name : 'summary',
	        allowBlank : true ,
	        anchor : '80%'
		});
    	        
	var cashFlowAddFormSubmit = function(){
		if (cashFlowAddWin.getComponent('cashFlowAddFormId').form.isValid()) {
    		cashFlowAddWin.getComponent('cashFlowAddFormId').form.submit({
			    url : '/cashflow/add.action',
			    method : 'POST',
			    waitTitle : '提示',
			    waitMsg : '正在处理您的请求,请稍候...',
			    success : function(form, action) {
			    	try {
			    		var flag = action.result.success;
			    		if (flag === false) {
			    		} else if (flag === true) {
						    cashFlowAddForm.getForm().reset();
						    window.location.href = "index.jsp";
			    		}
			    	} catch (e) {
			    		Ext.MessageBox.alert('提示', '对不起，您无法连接系统，如果您的网络正常，请联系系统管理员!'
			    							 + '\n' + e.toString());
			    	}
			    },
			    failure : function(form, action) {
			    	try {
			    		Ext.MessageBox.alert('提示', action.result.message);
			    	} catch (e) {
			    		Ext.MessageBox.alert('提示', '对不起，您无法连接系统，如果您的网络正常，请联系系统管理员!');
			    	}
			    }
			});
		}
	}
	
    var cashFlowAddForm = new Ext.FormPanel({
	    	id : 'cashFlowAddFormId',
	    	name : 'cashFlowAddFormId',
	    	frame : true,
			labelWidth : 70,
			labelAlign : 'right',
			bodyStyle : 'padding:5px 5px 0',
			width : 350,
	    	items : cashFlowAddField,
			buttons : [{
			text : '保存',
			handler : cashFlowAddFormSubmit
		}, {
		text : '重置',
		handler : function() {
			Ext.MessageBox.confirm('提示信息','当前数据将不会保存,您确定要取消吗?', function(btn) {
				if (btn == "yes") {
					cashFlowAddForm.getForm().reset();
				}
			});
		}
		}],
		keys : [{
			key : Ext.EventObject.ENTER,
			fn : cashFlowAddFormSubmit,
			scope : this
					}]
    	});
    
    var cashFlowAddWin = new Ext.Window({
    		id : 'cashFlowAddWinId',
    		name : 'cashFlowAddWinId',
    		title : '添加',
    		iconCls : 'application',
    		width : cashFlowAddForm.width,
    		height : cashFlowAddForm.height,
    		closable : true,
			collapsible : false,
			draggable : true,
			resizable : false,
			maximizable : false,
			modal : false,
			border : true,
    		items : [cashFlowAddForm]
    });
	cashFlowAddWin.show();
}
	//初始化Grid显示的数据
	var cashFlowDatas = new Array();
        cashFlowDatas.push(['1','2010-01-01','测试账户','支出','老公',85.23,'测试']);
        cashFlowDatas.push(['2','2010-01-01','a','a','a',33.0,'a']);

	var cashFlowDscol = new Array();
		cashFlowDscol.push({name:'flowID'});
		cashFlowDscol.push({name:'payDate'});
		cashFlowDscol.push({name:'payAccount'});
		cashFlowDscol.push({name:'payType'});
		cashFlowDscol.push({name:'operator'});
		cashFlowDscol.push({name:'amount'});
		cashFlowDscol.push({name:'summary'});

	var cashFlowDs = new Ext.data.SimpleStore({
	    	fields:cashFlowDscol
	    });
	cashFlowDs.loadData(cashFlowDatas) ;

	var cashFlowGridSM = new Ext.grid.CheckboxSelectionModel() ;
	//初始化表格的题头
	var cashFlowHead = new Array();
	//添加一个自动编号的列
	cashFlowHead.push(new Ext.grid.RowNumberer());
	//cashFlowHead.push(cashFlowGridSM);  
	cashFlowHead.push({header: '收支时间',dataIndex:'payDate',width:100,sortable:true,type:'date'});
	cashFlowHead.push({header: '账户',dataIndex:'payAccount',width:100,sortable:true,type:'string'});
	cashFlowHead.push({header: '收支分类',dataIndex:'payType',width:100,sortable:true,type:'string'});
	cashFlowHead.push({header: '家庭成员',dataIndex:'operator',width:100,sortable:true,type:'string'});
	cashFlowHead.push({header: '金额',dataIndex:'amount',width:100,sortable:true,type:'float'});
	cashFlowHead.push({header: '摘要',dataIndex:'summary',width:200,sortable:true,type:'string'});
		
	//tbar中的操作按钮
	var cashFlowTbarAdd = {
		iconCls: 'database_add',
		tooltip: '添加新的记录',
		text:'添加记录',
	                handler: cashFlowAdd
	    } ;
	    
	var cashFlowTbarDelete = {
		iconCls: 'database_remove',
		tooltip: '删除选择的记录',
		text:'删除记录',
	                handler: function(){alert('delete')}
	    } ;
	    
	var cashFlowTbarUpdate = {
		iconCls: 'database_add',
		tooltip: '更新选择的记录',
		text:'更新记录',
	                handler: function(){alert('update')}
	    } ;
	
	var cashFlowGrid = new Ext.grid.GridPanel({
	        store: cashFlowDs,
	        //sm:cashFlowGridSM,
	        columns: cashFlowHead,
	        enableDragDrop: false, 
	        width: Ext.get("cashFlowOutDiv").getWidth(),
	        height: Ext.get("cashFlowOutDiv").getHeight(), 
	        stripeRows: true,
	        tbar: [cashFlowTbarAdd , '-' , cashFlowTbarDelete ,'-', cashFlowTbarUpdate ]
	    });
	    
	cashFlowGrid.render('cashFlowDiv');
	cashFlowGrid.getSelectionModel().selectFirstRow();

});


</script>

<div id="cashFlowOutDiv" style="width:100%;height:100%;">
	<div id="cashFlowDiv"> </div>
</div>